<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" Content="text-html; charset=Windows-1252">
<title>To add hyperlinks to each region of the image map</title>
<style>@import url(coUA.css);</style>
<link disabled rel="stylesheet" href="htmlhelp.css">
</HEAD>

<BODY>
<h1>To add hyperlinks to each region of the image map</h1>

<ol>
<li>Copy the following code inside each <code>&lt;AREA&gt;</code> tag of your image map to call the TextPopup method of the HTML Help ActiveX control:</li>
<p><code>
A HREF=&quot;JavaScript:<i>image_popup</i>.TextPopup(<i>text_variable</i>, <i>font_variable</i>,9,9,-1,-1)&quot;
</code>
<p>where <i>image_popup</i> is the ID you specified in <a href="ocx_scripts_imagepopup5.htm">step 4</a>,
<i>text_variable</i> and <i>font_variable</i> are the variables names you specified in <a href="ocx_scripts_imagepopup3.htm">step 2</a>,
and the numeric values are the left and right margins (9,9) and the foreground and background colors (-1, -1) of the window. </p>

<br>
<li>Repeat step 1 for each region in your image map.
</ol>

<h3>Example</h3>
The hyperlinks shown below have been added to the example image map shown in <a href="ocx_scripts_imagepopup2.htm">Step 1</a>:

<p><code>
&lt;AREA SHAPE=RECT COORDS="4,2,108,103" A HREF=&quot;JavaScript:image_popup(square1,popfont,9,9,-1,-1)&quot; Title="Square 1"&gt;</p>
<p>
&lt;AREA SHAPE=RECT COORDS="117,6,212,104" A HREF=&quot;JavaScript:image_popup(square2,popfont,9,9,-1,-1)&quot; Title="Square 2"&gt;</p>
<p>
&lt;AREA SHAPE=RECT COORDS="3,111,105,213" A HREF=&quot;JavaScript:image_popup(square3,popfont,9,9,-1,-1)&quot; Title="Square 3"&gt;</p>
<p>
&lt;AREA SHAPE=RECT COORDS="114,113,211,210" A HREF=&quot;JavaScript:image_popup(square4,popfont,9,9,-1,-1)&quot; Title="Square 4"&gt;
&lt;/MAP&gt;</p>
</code></p>


<p>The annotated image map is shown below:</p>
<IMG SRC="test.GIF" USEMAP="#test" BORDER=0 WIDTH=216 HEIGHT=216>
<MAP NAME="test">

<AREA SHAPE=RECT COORDS="4,2,108,103" A HREF="JavaScript:image_popup.TextPopup
(square1,popfont,9,9,-1,-1)" Title="Square 1">

<AREA SHAPE=RECT COORDS="117,6,212,104" A HREF="JavaScript:image_popup.TextPopup
(square2,popfont,9,9,-1,-1)" Title="Square 2">

<AREA SHAPE=RECT COORDS="3,111,105,213" A HREF="JavaScript:image_popup.TextPopup
(square3,popfont,9,9,-1,-1)" Title="Square 3">

<AREA SHAPE=RECT COORDS="114,113,211,210" A HREF="JavaScript:image_popup.TextPopup
(square4,popfont,9,9,-1,-1)" Title="Square 4">
</MAP>
</p> 

<h3>Note</h3>
<ul>
<li> The <code>&lt;A&gt;</code> tag <code>TITLE</code> parameter is optional.</li>
</ul>

<br>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top"><a href="ocx_scripts_imagepopup.htm"><img src="bkarrow.gif" alt="back to the beginning" border="0"></a>
</td>
<td><a href="ocx_scripts_imagepopup.htm">Back to the beginning</A>
</td>
</tr>

<tr>
<td>&nbsp;</td>
</tr>

<tr>
<td valign="top"><a href="ocx_scripts.htm"><img src="home.gif" alt="link to overview topic" border="0"></a>
</td>
<td><a href="ocx_scripts.htm">About the script and DHTML examples</A>
</td>
</tr>

<tr><td>&nbsp;</td>
</tr>
</table>


<OBJECT
id=image_popup
type="application/x-oleobject"
classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"

>
</OBJECT>


<SCRIPT Language=JavaScript>
popfont="Verdana,10,, bold"
square1="Welcome to Square 1!"
square2="This is Square 2!"
square3="Welcome to Square 3!"
square4="Square 4 welcomes you!"
</SCRIPT>

</BODY>
</HTML>
